<!DOCTYPE html>
<html lang="zh" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://cdn.bootcss.com/jquery.form/4.2.2/jquery.form.min.js"></script>
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css"
          integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

    <!-- 可选的 Bootstrap 主题文件（一般不用引入） -->
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap-theme.min.css"
          integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">

    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"
            integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
            crossorigin="anonymous"></script>
    <link href="https://cdn.bootcss.com/fancybox/3.2.1/jquery.fancybox.min.css" rel="stylesheet">
    <script src="https://cdn.bootcss.com/fancybox/3.2.1/jquery.fancybox.min.js"></script>
    <title>管理员</title>
</head>
<body>
<nav class="navbar navbar-default navbar-fixed-top">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
            </button>
            <a class="navbar-brand" href="/"><strong>活动管理系统</strong></a>
        </div>
        <div class="navbar-right">
            <!--/*@thymesVar id="acProve" type="cn.medemede.j2ee.model.AcProve"*/-->
            <p class="navbar-text" th:text="'【管理员】 '+(${acProve.getStuName()}?:'')"></p>
            <a class="btn btn-default navbar-btn" href="/j2ee/logout">注销</a>
        </div>
    </div>
</nav>
<div class="page-header" style="width: 400px;text-align: center;margin: 70px auto">
    <h1>查看</h1>
</div>

<nav>
<ul class="nav nav-tabs" style="width: 1200px;margin: 0 auto">
    <li role="presentation" class="active">
        <a href="#stuView" data-toggle="tab">学生列表</a>
    </li>
    <li role="presentation">
        <a href="#acView" data-toggle="tab">活动列表</a>
    </li>
</ul>
</nav>

<div class="tab-content">
<div class="tab-pane fade in active" id="stuView">
    <div class="panel panel-default" style="width: 1200px;margin: 20px auto auto auto">
        <!-- Default panel contents -->
        <div class="panel-heading">详细信息</div>
        <div class="panel-body">
            <ul>
                <li>你可以修改你的管理员密码</li>
                <li>你可以打包导出所有的学生证明文档</li>
                <li>你可以删除无效的学生证明</li>
            </ul>
            <a id="showUpdatePwd" href="#updateStu" class="btn btn-info" style="float: right">修改密码</a>
        </div>

        <!-- Table -->
        <table class="table table-striped table-hover" style="text-align: center">
            <tr>
                <td><strong>学号</strong></td><td><strong>姓名</strong></td> <td><strong>班级</strong></td>
                <td><strong>参与活动数量</strong></td><td>操作</td>
            </tr>

            <!--/*@thymesVar id="proveList" type="java.util.List<cn.medemede.j2ee.model.AcProve>"*/-->
            <tr th:each="stu: ${proveList}">
                <td th:text="${stu.getStuId()}"></td>
                <td th:text="${stu.getStuName()}"></td>
                <td th:text="${stu.getLevel()}+${stu.getKlass()}"></td>
                <td th:text="${stu.getAcList().size()}"></td>
                <td>
                    <a th:name="${stu.getStuId()}" class="btn btn-warning stu-delete">删除</a>
                </td>
            </tr>
            <tr>
                <td colspan="8">
                    <a class="btn btn-info" href="/j2ee/stuinfo/stuList">打包导出</a>
                </td>
            </tr>
        </table>
    </div>
</div>


<div class="tab-pane fade" id="acView">
    <div class="panel panel-default" style="width: 1200px;margin: 20px auto auto auto">
        <!-- Default panel contents -->
        <div class="panel-heading">详细信息</div>
        <div class="panel-body">
            <ul>
                <li>你可以在这里管理所有活动</li>
                <li>处于开启状态的活动可以被录入</li>
            </ul>
        </div>
        <!-- Table -->
        <table class="table table-striped table-hover" style="text-align: center">
            <tr>
                <td><strong>活动名</strong></td><td><strong>活动时间</strong></td> <td><strong>活动单位</strong></td>
                <td><strong>状态</strong></td><td><strong>创建时间</strong></td><td><strong>过期时间</strong></td>
                <td>操作</td>
            </tr>
            <!--/*@thymesVar id="activeList" type="java.util.List<cn.medemede.j2ee.model.Active>"*/-->
            <tr th:each="ac: ${activeList}">
                <td th:text="${ac.getAcName()}"></td>
                <td th:text="${ac.getAcTime()}"></td>
                <td th:text="${ac.getAcUnit()}"></td>
                <td th:text="${ac.getStruts()}=='1'?'开启':'关闭'"></td>
                <td th:text="${ac.getCreatDate()}"></td>
                <td th:text="${ac.getClearDate()}"></td>
                <td>
                    <a class="btn btn-info ac-delete"  th:href="'/j2ee/acinfo/ac/'+${ac.getAcName()}">导出</a>
                    <a th:name="${ac.getAcName()}" class="btn btn-info ac-unlock">开启</a>
                    <a th:name="${ac.getAcName()}" class="btn btn-warning ac-lock">关闭</a>
                </td>
            </tr>
            <tr>
                <td colspan="7">
                    <a id="showAddAcView" class="btn btn-info" href="#addAcView">添加活动模板</a>
                </td>
            </tr>
        </table>
    </div>
</div>
</div>


<div class="container" id="addAcView" style="display: none">
    <div class="row">
        <div class="panel panel-default" style="width:560px;margin:0 auto auto auto;text-align:center">
            <div class="panel-heading"><h4>修改个人信息</h4></div>
            <div class="panel-body">
                <br>
                <form id="add_ac" action="/j2ee/acinfo/ac" method="post">
                    <div class="input-group">
                        <span class="input-group-addon">活动名：</span>
                        <input name="acName" type="text" class="form-control">
                    </div>
                    <br>
                    <div class="input-group">
                        <span class="input-group-addon">活动时间：</span>
                        <input name="acTime" type="date" class="form-control">
                    </div>
                    <br>
                    <div class="input-group">
                        <span class="input-group-addon">活动单位：</span>
                        <input name="acUnit" type="text" class="form-control">
                    </div>
                    <br>
                    <div class="input-group">
                        <span class="input-group-addon">过期时间：</span>
                        <input name="days" type="text" class="form-control" placeholder="几天后过期">
                    </div>
                    <br>
                    <div>
                        <input class="btn btn-default" type="submit" value="添加">
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<script>
    $(document).ready(function () {

        /*弹出框js*/
        $("#showAddAcView").fancybox({
            'autoDimensions': false,
            'centerOnScroll': true,
            'scrolling': false
        });

        /*删除学生*/
        $(".stu-delete").click(function () {
            var stuId = $(this).attr("name");
            $.ajax({
                url: "/j2ee/stuinfo/stuList",
                type: "post",
                dataType: "json",
                data: {
                    _method: "delete",    //将POST请求转换为DELETE请求
                    stuId: stuId         //传送的json值
                },
                success: function (data) {
                    alert(data.msg);
                    window.location.reload();
                }
            });
        });

        /*关闭活动*/
        $(".ac-lock").click(function () {
            var acName = $(this).attr("name");
            $.ajax({
                url: "/j2ee/acinfo/lock",
                type: "post",
                dataType: "json",
                data: {
                    _method: "put",    //将POST请求转换为PUT请求
                    acName: acName         //传送的json值
                },
                success: function (data) {
                    alert(data.msg);
                    window.location.reload();
                }
            });
        });

        /*开启活动*/
        $(".ac-unlock").click(function () {
            var acName = $(this).attr("name");
            $.ajax({
                url: "/j2ee/acinfo/unlock",
                type: "post",
                dataType: "json",
                data: {
                    _method: "put",    //将POST请求转换为PUT请求
                    acName: acName         //传送的json值
                },
                success: function (data) {
                    alert(data.msg);
                    window.location.reload();
                }
            });
        });

        var options = {
            success:showResponse1,  // 提交后
            dataType:'json' // 'xml', 'script', or 'json' (接受服务端返回的类型.)
        };

        $('#add_ac').ajaxForm(options);

    });

    //  提交后
    function showResponse1(responseText, statusText) {
        parent.$.fancybox.close();
        if(statusText==="success"){
            alert(responseText.msg);
        }else {
            alert('提交状态: ' + statusText + '\n\n 返回的内容是: \n' + responseText.msg);
        }
        window.location.reload();
    }
</script>
</body>
</html>